<!--
  * @Description: 设置首页
  * @Author: rcc
  * @Date: 2024-08-16 10:46:16
  * @FilePath: /rc-recruitment/pages_site/pages/home/home.vue
-->

<template>
  <view class="main-view p-h24">
    <view class="card flex-sb">
      <text class="text-700-130">用户名</text>
      <text class="text-500-430">{{ userInfo.nickname }}</text>
    </view>
    <view class="card flex-sb" @click="toPage('/pages_site/pages/phone/phone')">
      <text class="flex-1 text-700-130">手机号</text>
      <text class="m-r10 text-500-430">{{ userInfo.mobile }}</text>
      <image class="square-36" src="@/static/images/public/arrow-3.png" />
    </view>
    <view class="card flex-sb" @click="toPage('/pages_site/pages/password/password')">
      <text class="text-700-130">修改密码</text>
      <image class="square-36" src="@/static/images/public/arrow-3.png" />
    </view>
    <view class="card flex-sb" @click="toPage('/pages_site/pages/about/about')">
      <text class="text-700-130">关于我们</text>
      <image class="square-36" src="@/static/images/public/arrow-3.png" />
    </view>

  </view>
</template>

<script lang="ts" setup>
  import { storeToRefs } from 'pinia'

  import { useUserStore } from '@/stores/user.ts'

  const userStore = useUserStore()
  const { userInfo } = storeToRefs(userStore)

  const toPage = (url : string) => {
    uni.navigateTo({ url })
  }

</script>

<style lang="scss" scoped>
	page {
		background-color: $page-color-4;
	}

	.main-view {
		margin: 40rpx 24rpx;
		border-radius: 10rpx;
		background-color: $bg-color-1;
	}

	.card {
		height: 102rpx;
		border-bottom: 1rpx solid $border-color-4;

		&:last-child {
			border: none;
		}
	}
</style>
